<!DOCTYPE html>
<html lang="zh_CN" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
  <title>修改密</title>
  <head th:include="common::head"></head>
</head>
  
<body>
      
<div class="container-fluid">
  <div class="row">
    <div class="col-lg-12">
      <div class="card">
        <div class="card-body">
          <form class="edit-pwd-form" id="form">
            <div class="form-group">
              <label for="old-password">旧密码</label>
              <input type="password" class="form-control" name="password" id="old-password" placeholder="输入账号的原登录密码">
            </div>
            <div class="form-group">
              <label for="new-password">新密码</label>
              <input type="password" class="form-control" name="newPwd" id="new-password" placeholder="输入新的密码">
            </div>
            <div class="form-group">
              <label for="confirm-password">确认新密码</label>
              <input type="password" class="form-control" name="confirmpwd" id="confirm-password" placeholder="请再次输入密码">
            </div>
            <button class="btn btn-primary" onclick="submitForm()">修改密码</button>
          </form>
        </div>
      </div>
    </div>
  </div>
</div>

<div th:include="common::js-basic"></div>
<div th:include="common::js-form"></div>
<script th:inline="javascript">


  function submitForm(){
    var bootstrapValidator = $(".edit-pwd-form").data('bootstrapValidator');
    //验证为通过提示信息
    bootstrapValidator.validate();
    if(!bootstrapValidator.isValid()){
        return false;
    }else {
      var jsonParams = getSubmitParams();
      console.log(jsonParams);
      $.ajax({
        url: '/user/doEdit',
        type: 'POST',
        dataType: 'json',
        data: jsonParams,
        success: function (data) {
          // 假设ajax提交操作
          if (data.code == 1) {
            alert(data.msg);
          } else {
            alert('失败');
          }
        },
        error: function () {

        }
      });
    }
  }

  function getSubmitParams() {
    var params = {};
    $('#form').find('input[name]').each(function () {
      params[$(this).attr('name')] = $(this).val();
    });
    return params;
  }

  $(document).ready(function () {

    //表单验证
    $('.edit-pwd-form').bootstrapValidator({
      message: 'This value is not valid',
      feedbackIcons: {
        valid: 'glyphicon glyphicon-ok',
        invalid: 'glyphicon glyphicon-remove',
        validating: 'glyphicon glyphicon-refresh'
      },
      fields: {
        password: {
          validators: {
            notEmpty: {
              message: '原密码不能为空'
            }
          }
        },
        newPwd: {
          validators: {
            notEmpty: {
              message: '新密码不能为空'
            },
            identical: {
              field: 'confirmpwd',
              message: '密码和确认密码不一致'
            },
          }
        },
        confirmpwd: {
          validators: {
            notEmpty: {
              message: '确认密码不能为空'
            },
            identical: {
              field: 'newPwd',
              message: '密码和确认密码不一致'
            }
          }
        }
      }
    });


  });

</script>
</body>
</html>